<!-- 初审 -->
<script lang="ts" setup>
import { ref, reactive, onMounted } from 'vue'
import {
  NSpace,
  NButton,
  type FormInst,
  NForm,
  NFormItem,
  NInput,
  NRadioGroup,
  NRadio,
  type FormRules,
  useMessage,
  NScrollbar,
  NSpin
} from 'naive-ui'
import { useRoute } from 'vue-router'
import { sendRequest } from '@/utils/api'
import FixedAction from '@/components/FixedAction.vue'
import VUpload from '@/views/OA/Common/Upload.vue'
import useRouteReplace from '@/hooks/useRouteReplace'
const route = useRoute()
const routeReplace = useRouteReplace(route.query.redirect as string)
const props = defineProps({
  id: { type: String, default: () => null },
  typeShow: { type: Number, default: () => 0 }
})
const array = route.query?.id?.split(',') || []
const emit = defineEmits<{
  (event: 'close'): void
  (event: 'update'): void
}>()
const message = useMessage()
const userFormRef = ref<FormInst | null>(null)
const loading = ref(false)
const form = reactive({
  id: array?.[0],
  water: null,
  result: null,
  fileId: null
})
const featureRule = ref<number | null>(null)
const flowRule = ref<number | null>(null)
const formRules: FormRules = {
  result: {
    required: true,
    trigger: ['blur', 'change'],
    type: 'number',
    message: '所属部门/单位不能为空'
  }
}

const submit = async () => {
  const validate = await Promise.all([
    new Promise((resolve, reject) => {
      userFormRef.value?.validate((error) => {
        if (error) return reject(error)
        resolve(true)
      })
    })
  ])

  if (!validate.every(Boolean)) return

  loading.value = true
  const [error, res] = await sendRequest({
    module: 'user',
    api: array?.[0] ? 'update' : 'save',
    override: {
      data: {
        ...form,
        roleIdList: [featureRule.value, flowRule.value].filter(Boolean) as unknown as number[]
      }
    }
  })
  loading.value = false

  if (error) return message.error(error.message)
  if (res.code !== 0) return message.error(res.msg)
  message.success(res.msg)
  emit('close')
  emit('update')
}
// 返回
const goBack = () => {
  // history.back()
  routeReplace()
}
onMounted(async () => {
  // 修改回显
  return
  // if (props.id) {
  //   sendRequest<HttpResponse<UserModel>>({
  //     module: 'user',
  //     api: 'info',
  //     uri: {
  //       id: props.id
  //     }
  //   }).then(([err, res]) => {
  //     if (err) return
  //     keysOf(res.data).forEach((e) => {
  //       if (e === 'functionRoleId') {
  //         return (featureRule.value = res.data.functionRoleId)
  //       }
  //       if (e === 'flowRoleId') {
  //         return (flowRule.value = res.data.flowRoleId)
  //       }
  //       form[e] = res.data[e] as never
  //     })

  //     const role = featureOptions.value?.find((e) => e.id === res.data.functionRoleId)
  //     if (!role) return
  //     queryMenuOptions(role.id)
  //   })
  // }
})
// 获取修改详情
const fileList: any = ref([])
const getDispatchInfo = async () => {
  const [error, res] = await sendRequest({
    module: 'duty',
    api: 'dutyInfo',
    uri: {
      id: route?.query?.id
    }
  })
  if (error) return message.error(error.message)
  if (res.code !== 0) return message.error(res.msg)
  fileList.value = res.data.fileList
}
const handleUploadList = (v: any) => (form.fileId = v)
</script>

<template>
  <DetailFormProvider>
  <div class="main">
    <div class="form_content">
      <NScrollbar>
        <NSpin :show="false">
          <div class="content">
            <div class="topTitle">初审意见</div>
            <NForm
                require-mark-placement="left"
              :model="form"
              :rules="formRules"
              ref="userFormRef"
              label-placement="left"
              label-width="110"
            >
              <NSpace>
                <NFormItem
                  label="审批结论"
                  path="result"
                >
                  <NRadioGroup v-model:value="form.result">
                    <NRadio
                      :value="1"
                      label="通过"
                    />
                    <NRadio
                      :value="0"
                      label="驳回"
                    />
                  </NRadioGroup>
                </NFormItem>
                <NFormItem label="附件:">
                  <VUpload
                    :file-list="fileList"
                    @getList="handleUploadList"
                  />
                </NFormItem>
              </NSpace>
              <NFormItem
                label="审核意见"
                path="water"
              >
                <NInput
                  v-model:value="form.water"
                  class="inputWH"
                  type="textarea"
                  :disabled="route.query?.typeShow == 1"
                />
              </NFormItem>
            </NForm>
          </div>
        </NSpin>
      </NScrollbar>
    </div>
  </div>
</DetailFormProvider>
  <FixedAction>
    <NSpace justify="center">
      <NButton
        style="width: 78px"
        ghost
        @click="goBack"
      >
        取消
      </NButton>
      <NButton
        type="primary"
        style="width: 78px"
        @click="submit"
        :loading="loading"
      >
        确定
      </NButton>
    </NSpace>
  </FixedAction>
</template>
<style scoped lang="scss">
@mixin CommonFont {
  font-size: 18rem;
  font-family: PingFangSC, PingFang SC;
  font-weight: 400;
  color: #333333;
}

.main {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  overflow: hidden;

  .form_content {
    width: 100%;
    height: 100%;
    padding: 20rem 20rem 0;

    .topTitle {
      font-size: 22px;
      font-family: PingFangSC, PingFang SC;
      font-weight: 500;
      color: #5fb17f;
      margin-bottom: 10rem;
    }
    .inputWH {
      width: 300rem;
    }
    .content {
      display: flex;
      flex-direction: column;
      width: 100%;
      height: 100%;
      padding: 18rem 33rem 120rem;
      overflow-y: scroll;
      background-color: #ebeceb;
      @include CommonFont;
    }
  }
}
.content::-webkit-scrollbar {
  display: none;
}

:deep(.n-spin-container) {
  width: 100%;
  height: 100%;
}

:deep(.n-scrollbar-container) {
  width: 100%;
  height: 100%;
}

:deep(.n-scrollbar-content) {
  width: 100%;
  height: 100%;
}

:deep(.n-spin-content) {
  width: 100%;
  height: 100%;
}
</style>
